<!DOCTYPE html>
<html>
	<head lang="en">
		<meta charset="UTF-8">
		<title>课工场论坛列表</title>
		<link href="css/bbs.css" rel="stylesheet">
		<script type="text/javascript" src="js/jquery.js">
		</script>
		<script type="text/javascript">
			$(function(){
				$(".bbs header span").click(function(){
					$(".post").show();
				})
				$(".btn").click(function(){
					$(".post").hide();
					
					var str1=$(".post input[class=title]").val();
					var str2="所属板块："+$("select").val();
					var day=new Date();
					var year=day.getFullYear();
					var mon=day.getMonth();
					var date=day.getDate();
					var hh=day.getHours();
					var mm=day.getMinutes();
					var str3="发表时间："+year+"-"+mon+"-"+date+" "+hh+":"+mm;
					var num=Math.floor(Math.random()*4+1);
					var str4="img/tou0"+num+".jpg";
					
					var $li=$("<li></li>")
					var $div=$("<div></div>")
					var $img=$("<img src="+str4+" />")
					$("ul").append($li);
					$li.append($div);
					$div.append($img);
					$h1=$("<h1>"+str1+"</h1>");
					$li.append($h1);
					$p=$("<p></p>");
					$span1=$("<span>"+str2+"</span>");
					$span2=$("<span>"+str3+"</span>");
					$p.append($span1);
					$p.append($span2);
					$li.append($p);
				})
			})
		</script>
	</head>
	<body>
		<div class="bbs">
			<header><span >我要发帖</span></header>
			<section>
				<ul id="postList">
					<li>
						<div><img src="img/tou02.jpg"></div>
						<h1>ggggg</h1>
						<p><span>版块：新手报到</span><span>发表时间：2019-11-18 17:28</span></p>
					</li>
					<li>
						<div>
							<img src="img/tou01.jpg"></div>
						<h1>ddddd</h1>
						<p><span>版块：新课来了</span><span>发表时间：2019-11-18 17:27</span></p>
					</li>
				</ul>
			</section>

			<div class="post" id="post1">
				<input class="title" placeholder="请输入标题（1-50个字符）" />
				所属版块：<select>
					<option>请选择版块</option>
					<option>电子书籍</option>
					<option>新课来了</option>
					<option>新手报到</option>
					<option>职业规划</option>
				</select>
				<textarea class="content"></textarea>
				<input class="btn" value="发布" />
			</div>
		</div>
	</body>
</html>
